/* 
vuex最核心管理对象/仓库 store
*/
import Vue from 'vue'
import Vuex from 'vuex'

// 安装Vuex
Vue.use(Vuex)

// 包含n个状态数据的对象
const state = {
  count: 1
}
// 包含n个用于同步更新状态数据的方法的对象
const mutations = {
  // 增加的mutation
  increment (state, num) {
    state.count += num
  },
  // 减少的mutation
  decrement (state, payload) {  // 载荷/数据
    state.count -= payload
  },
}
// 包含n个用于间接同步/异步更新状态数据的方法的对象
const actions = {
  /* 
  奇数才增加的同步action  (带逻辑处理)
  context: 包含state和commit的对象
  */
  incrementIfOdd (context, num) {
    // 如果当前count是奇数, 才触发increment mutation调用
    if (context.state.count%2===1) {
      context.commit('increment', num)
    }
  },

  /* 
  延迟1S增加的异步action
  */
  incrementAsync ({commit}, num) {
    setTimeout(() => {
      commit('increment', num)
    }, 1000);
  }
}
// 包含n个用于根据state数据计算产生数据的方法的对象
const getters = {
  evenOrOdd (state) {
    return state.count%2===1 ? '奇数' : '偶数'
  }
}

// 创建并暴露store
const store = new Vuex.Store({
  state,
  mutations,
  actions,
  getters,
})

export default store
